/**app.wxss**/
page{
  background-color: #f5f5f5;
  color: #333;
  font-size: 24rpx;
  line-height: 24rpx;
}
image{
  display: -webkit-flex;
  display: flex;
  width:100%;
  height: 100%;
}
video{
  width: 100%;
  height: 100%;
}
text{
  display:inline-block;
  overflow: hidden;
  text-overflow: ellipsis;

}
/* 文字多行省略 */
.multiColumn{
  display: -webkit-box;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  word-wrap: break-word;
  white-space: normal !important;
  -webkit-line-clamp: 2; /*  行数*/
  -webkit-box-orient: vertical;
}
button{
  padding: 0rpx;
  margin: 0rpx;
  border-radius: 0rpx;
  font-weight: normal;
  border: none;
}
button::after{
	border: none;
	width: 0rpx;
}

button:not([size='mini']) {
  width: auto;
  padding: 0rpx;
  margin: 0rpx;
  border-radius: 0rpx;
  font-weight: normal;
}

/* 公用布局类 */
.w{
  width: calc(100% - 60rpx);
  margin:0 auto;
}
.wp{
  width: 100%;
  box-sizing: border-box;
  padding-left: 30rpx;
  padding-right: 30rpx;
}
.clear::after{
  clear: both;
}
.dpflxr{
  display: -webkit-flex;
  display: flex;
  /* flex-direction: row; */
  flex-flow: row wrap;
  align-items: center;
  /* justify-content: fle; */
  
}
.dpflxrjb{
  width: 100%;
  display: -webkit-flex;
  display: flex;
  /* flex-direction: row; */
  flex-flow: row wrap;
  align-items: center;
  justify-content: space-between;
  
}
.dpflxrjbfs{
  width: 100%;
  display: -webkit-flex;
  display: flex;
  /* flex-direction: row; */
  flex-flow: row wrap;
  align-items: flex-start;
  justify-content: space-between;
  
}

.dpflxrjc{
  width: 100%;
  display: -webkit-flex;
  display: flex;
  /* flex-direction: row; */
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
  
}
.dpflxc{
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: center;

}
.dpflxcjc{
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.dpflxcjb{
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}
.dpflxcjbfs{
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;

}
.dpflxcfs{
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: flex-start;

}
.dpflxcfe{
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  align-items: flex-end;

}
.flt{
  float: left;
}
.frt{
  float: right;
}
.pos_rel{
  position: relative;
}
.pos_abs{
  position: absolute;
}
.cardF{
  
  background-color: #fff;
}
.card{
  margin-top: 20rpx;
  background-color: #fff;
}
.lineIcon{
  width:6rpx;
  height: 32rpx;
}
.tabLineIcon{
  width: 40rpx;
  height: 4rpx;
  margin-top: -4rpx;
}
.moreIcon{
  width: 12rpx;
  height: 12rpx;
}
/* 代码示例：
   <view class="radio"></view>
*/
.radio{
  width: 32rpx;
  height: 32rpx;
  background: url() no-repeat center;
  background-size: cover;  
  margin-right: 20rpx; 
}
.radio.actived{
  background: url() no-repeat center;
  background-size: cover;   
}
.radio2{
  width: 32rpx;
  height: 32rpx;
  background: url() no-repeat center;
  background-size: cover;   
  margin-right: 20rpx;
}
.radio2.actived{
  background: url() no-repeat center;
  background-size: cover;   
}
.checkIcon{
  width: 28rpx;
  height: 28rpx;
  background: url() no-repeat center;
  background-size: cover;   
  margin-right: 20rpx;
}
.checkIcon.actived{
  background: url() no-repeat center;
  background-size: cover;   
}
/* 代码示例：
   <picker class="selector wp dpflxr">
            <text>全部团队</text>
            <view class="downArrow frt">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_downArrow.png"></image>
            </view>
    </picker>
*/
.selector{
  background-color: #fff;
  font-size: 28rpx;
  line-height: 80rpx;
  color: #333;
  border-top: 1rpx #eee solid;
}
.selector .downArrow{
  margin-top: 34rpx;
}

/* 1类型标题盒子 大标题+小字单位 */
/*-  代码示例：
 
     <view class="title_box1 dpflxr">
            <text class="tbTilte">来访客户</text>
            <text>（单位：组）</text>
        </view>

*/
.title_box1{
  box-sizing: border-box;
  height: 100rpx;
  white-space: nowrap;
  font-size: 32rpx;
  color: #999;
  line-height: 32rpx;
  align-items: center;
  border-bottom: 1rpx #eee solid;
}
.title_box1 .tbTilte{
  font-size: 32rpx;
  color: #333;
  line-height: 32rpx;
  font-weight: bold;
  margin-right: 20rpx;
}



/* 2类型标题盒子 只有中文标题或加一个more*/
/* 代码示例：
  <view class="title_box2 wp dpflxr">
        <text>置业顾问</text>
        <navigator class="more dpflxr" hover-class="none" url="">
            <text>更多</text>
            <view class="icon">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_rightArrow.png"></image>
            </view>
        </navigator>
    </view>
*/
.title_box2 {
  width: 100%;
  box-sizing: border-box;
  box-sizing: border-box;
  padding-top: 40rpx;
  padding-bottom: 40rpx;
  font-size: 32rpx;
  color: #333;
  line-height: 32rpx;
  font-weight: bold;
  justify-content: space-between;
}
.title_box2 .more{
  font-size: 24rpx;
  line-height: 24rpx;
  color: #999;
  font-weight: normal;
}
.title_box2 .more .icon{
  width: 12rpx;
  height: 20rpx;
  margin-left: 20rpx;
}
.title_box2 .btn{
  width: 140rpx;
  height: 52rpx;
  border-radius: 26rpx;
  border: 1rpx #24c991 solid;
  text-align: center;
  font-size: 24rpx;
  line-height: 52rpx;
  color: #24c991;
}


/* 3类型标题盒子 只有中文标题颜色#333 字重700 */
/* 代码示例：
   <view class="title_box3 wp">
		<text>建筑规划</text>
    </view>
*/
.title_box3 {
  height: 100rpx;
  font-size: 36rpx;
  color: #333;
  line-height: 100rpx;
  font-weight: 700;
  /* justify-content: space-between; */
  /* border-bottom: 1rpx #eee solid; */
  background-color: #fff;
}
.title_box3 .icon{
  width: 40rpx;
  height: 40rpx;
  margin-right: 20rpx;
}

/* 4类型标题盒子 用户头像*/
/* 代码示例：
    <view class="title_box4">
        <view class="tb_left">
            <view class="avatar">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/img_bg.jpg" mode="aspectFill"></image>
            </view>
            <view class="words dpflxr">
                <text class="name">宝妈妈</text>
                <view class="icon">
                    <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_Plus.png"></image>
                </view>
            </view>
        </view>
        <view class="tb_btn actived">
            <text class="subscribed">已</text><text>关注</text>
        </view>
    </view>
*/
.title_box4{
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.title_box4 .tb_left .avatar{
  width: 60rpx;
  height: 60rpx;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 20rpx;
}
.title_box4 .tb_left .icon{
  width: 60rpx;
  height: 60rpx;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 20rpx;
}
.title_box4 .tb_left{
  display: -webkit-flex;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.title_box4 .tb_left .words{
  color: #333;
  height: 83rpx;
}
.title_box4 .tb_left .words .label{
  width: 88rpx;
  height: 40rpx;
  margin-left: 20rpx;
  border-radius: 8rpx;
}
.title_box4 .tb_left .time{
  font-size: 24rpx;
  line-height: 24rpx;
  color: #999;
}
.title_box4 .tb_btn{
  width: 100rpx;
  height: 48rpx;
  border-radius: 26rpx;
  background-color: #F9600D;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20rpx;
 
  color: #fff;
}
.title_box4 .tb_btn .subscribed{
  display:none;
}
.title_box4 .tb_btn.actived{
  background-color: #eee;
  color: #666;
}
.title_box4 .tb_btn.actived .subscribed{
  display: inline-block;
}

/* 5类型标题盒子 中文标题+左边线 */
/* 代码示例：
  <view class="title_box5 wp dpflxr">
      <view class="titleLine"></view>
      <text>TA说</text>
  </view>
*/
.title_box5{
  height: 100rpx;
  font-size: 28rpx;
  font-weight: bold;
  line-height: 100rpx;
  border-bottom: 1rpx #eee solid;
  box-sizing: border-box;
  padding-right: 30rpx;
}
.title_box5 .titleLine{
  width: 6rpx;
  height: 32rpx;
  background: #F9600D;
  border-radius: 3rpx;
  margin-right: 20rpx;
}

/* 箭头样式 */
/* 代码示例：
   <view class="downArrow">
          <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_downArrow.png"></image>
   </view>
   <view class="rightArrow">
            <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_rightArrow.png"></image>
   </view>
   <view class="returnBtn pos_abs dpflxr" style="top:{{statusBarHeight}}px">
      <navigator class="icon" open-type="navigateBack" delta="1"  hover-class="none">
          <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_return.png"></image>
      </navigator>
    </view>
*/
.rightArrow{
  width: 15rpx;
  height: 15rpx;
  margin-left: 20rpx;
  border-top: 3rpx #333 solid;
  border-right: 3rpx #333 solid;
  transform: rotateZ(45deg);
  box-sizing: border-box;
}
.downArrow{
 width: 15rpx;
 height: 15rpx;
 margin-left: 20rpx;
 border-bottom: 3rpx #333 solid;
 border-right: 3rpx #333 solid;
 transform: rotateZ(45deg);
 box-sizing: border-box;

}
.upArrow{
  width: 20rpx;
  height: 12rpx;
  margin-left: 20rpx;
}
.returnBtn {
  position: fixed;
  height: 88rpx;
  width: 100%;
  box-sizing: border-box;
  padding-left: 30rpx;
  color: #fff;
  font-size: 40rpx;
  line-height: 40rpx;
  font-weight: bold;
  z-index: 999;
}
.returnBtn .icon {
  width: 24rpx;
  height: 40rpx;
  margin-top: 22rpx;
}
.orderBtn{
  width: 14rpx;
  height: 20rpx;
  justify-content: space-between;
  margin-left: 20rpx;
}
.orderBtn .icon{
  width: 14rpx;
  height: 9rpx;
}
.circle{
	width: 24rpx;
	height: 24rpx;
	box-sizing: border-box;
	border: 4rpx solid #F9600D;
	border-radius: 50%;
	margin-right: 12rpx;
}
/* 信息展示或输入项相关样式 */
/* 代码示例：
  <view class="infoItem wp entry dpflxr">
        <text class="iTitle">项目名称：</text>
        <text class="iContent">长房·领秀时代</text>
    </view>
    <view class="infoItem wp entry dpflxr">
        <text class="iTitle">买房人姓名：</text>
        <input type="text" class="iContent" placeholder="请输入买房人姓名" placeholder-style="font-size:28rpx;line-height:100rpx;color:#999;"></input>
    </view>
     <view class="infoItem wp entry dpflxr ">
        <text class="iTitle">项目名称：</text>
        <picker class="iContent">
            <text>请选择</text>
            <view class="downArrow frt"></view>
        </picker>
    </view>
    <view class="infoItem wp entry dpflxc note">
        <text class="iTitle">指定接待：</text>
        <textarea maxlength="500"  placeholder="客户情况说明，越详细越利于成交" placeholder-style="font-size:28rpx;line-height:28rpx;color:#999;">
        </textarea>
    </view>
     <view class="infoItem wp present dpflxr">
            <text class="iTitle">建筑类型</text>
            <text class="iContent">住宅:小高层、花园洋房/别墅:叠加别墅</text>
     </view>
 
    <view class="infoItem wp entry2 dpflxr" >
        <text class="iTitle">姓名</text>
        <view class="iContent dpflxr">
           <text>张三</text>
            <view class="rightArrow ">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_rightArrow.png"></image>
            </view>
        </view>
    </view>
     <view class="infoItem wp upLoad dpflxr">
        <text class="iTitle">上传身份证正面照片</text>
       <veiw class="iContent">
            <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/img_bg9.jpg"></image>
       </veiw>
    </view>
    左右分布，左面标题，右面文字加箭头,点击下拉
    <view class="infoItem wp pullDown dpflxr last">
            <text class="iTitle">公共客户</text>
            <view class="iContent">
                <text>10人</text>
                <view class="downArrow frt">
                    <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_downArrow.png"></image>
                </view>
            </view>
        </view>
   左边是头像，右边带箭头
    <view class="infoItem wp avatar dpflxr">
            <view class="dpflxr">
                <view class="img">
                    <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/img_bg.png" mode="aspectFill"></image>
                </view>
                <text class="iTitle">林珊珊</text>
            </view>
            <view class="iContent dpflxr">
                <text>打卡记录</text>
                <view class="rightArrow ">
                    <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_rightArrow.png"></image>
                </view>
            </view>
        </view>
*/
.infoItem{
  height:100rpx ;
  font-size: 28rpx;
  line-height: 28rpx;
  color: #333;
  background-color: #fff;
  border-bottom: 1rpx #eee solid;
  white-space: nowrap;
}
.infoItem.last{
  border-bottom: none;
  /* border-radius: 0 0 30rpx 30rpx; */
}
.infoItem:last-of-type{
  border-bottom: none;
}
.infoItem .iTitle{
  width: auto;
}
.infoItem .iTitle .icon{
	width: 40rpx;
	height: 40rpx;
	margin-right: 30rpx;
}
.infoItem .iContent{
  width: calc(100% - 170rpx);
  justify-content: space-between;

}
.infoItem input{
  height: 100%;
}
.infoItem .iContent .downArrow{
  margin-top: 8rpx;
}
.infoItem.present{
  justify-content: space-between;
}
.infoItem.present .iTitle{
  color: #999;
}
.infoItem.present .iContent{
  width: auto;
  text-align: right;
}
.infoItem.note{
  height: 300rpx;
  align-items: flex-start;
}
.infoItem.note .iTitle{
  line-height: 100rpx;
}
.infoItem.note textarea{
  width: 100%;
  height: 200rpx;
}
.infoItem.entry2 .iContent{
 justify-content: flex-end;
 text-align: right;
  color: #666;
  width: auto;
 
}
.infoItem.entry2 .iContent .img{
  width: 100rpx;
  height: 100rpx;
  border-radius: 50rpx;
  overflow: hidden;
}
/* 代码示例：
   <view class="infoItem wp entry3 dpflxr">
            <text class="iTitle">买房人姓名：</text>
            <view class="dpflxrjb iContent">
                <input type="text" placeholder="请输入买房人姓名"
                    placeholder-style="font-size:28rpx;line-height:100rpx;color:#999;"></input>
                <text>元/m²</text>
            </view>

        </view>
*/
.infoItem.entry3 .iContent input{
  width: calc(100% - 100rpx);
}
.infoItem.entry4 .iContent input{
  width: 140rpx;
}

.infoItem .star{
  color: #FF2525;
}
.infoItem.avatar{
  height: 120rpx;
  justify-content: space-between;
}
.infoItem.avatar .iContent{
  justify-content: flex-end;
  text-align: right;
  color: #666;
  width: auto;
 
}
.infoItem.avatar  .img{
  width: 60rpx;
  height: 60rpx;
  border-radius: 50%;
  overflow: hidden;
  margin-right:20rpx;
}
.infoItem.upLoad{
  height: 260rpx;
  align-items: flex-start;
  padding-top: 30rpx;
  box-sizing: border-box;
}
.infoItem.upLoad .iTitle{
  width: calc(100% - 320rpx);
}
.infoItem.upLoad .iContent{
  width: 320rpx;
  height: 200rpx;
  border-radius: 20rpx;
  border: 1rpx #eee dotted;
  overflow: hidden;
}
/* 代码示例：
   <view class="infoItemWrapper actived">
            <view class="infoItem wp pullDown dpflxr ">
                <text class="iTitle">李晓丽</text>
                <view class="iContent">
                    <text>2人</text>
                    <view class="downArrow frt">
                        <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_downArrow.png"></image>
                    </view>
                    <view class="upArrow frt">
                        <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_upArrow.png"></image>
                    </view>
                </view>
            </view>
            <view class="customerList">
                <view class="customerItem dpflxc">
                    <view class="nameBtn dpflxr">
                        <text class="name">李先生</text>
                        <text class="btn">上访</text>
                    </view>
                    <text class="tel">15575991557</text>
                    <text class="lastDate">最后上访日期：2021-03-31</text>
                    <text class="intention">意向房型：F房型（118m²三房）</text>
                    <text class="note">跟进内容：本周六老婆一起上访</text>
                </view>
                <view class="customerItem dpflxc">
                    <view class="nameBtn dpflxr">
                        <text class="name">林总</text>
                        <text class="btn">认购</text>
                    </view>
                    <text class="tel">15575991557</text>
                    <text class="lastDate">最后上访日期：2021-03-31</text>
                    <text class="intention">意向房型：F房型（118m²三房）</text>
                    <text class="note">跟进内容：首付款不够，需下月签约</text>
                </view>

            </view>
        </view>
*/
.infoItem.pullDown .iContent{
  text-align: right;
  color: #356BF4;
}
.infoItemWrapper.actived .downArrow{
  display: none;
} 
.infoItemWrapper.actived .iContent .upArrow{
  display: block;
} 
.infoItem .iContent .upArrow{
  display: none;
}
.infoItemWrapper.actived .customerList{
  display: block;
}
/* 加单选按钮 */
/* 代码示例：
 <view class="infoItem wp radioBox dpflxrjb">
            <view class="iTitle dpflxr">
                <view class="radio actived"></view>
                <text>认购成功</text>
            </view>
            <view class="iContent dpflxr">
                <text>认购协议</text>
                <view class="rightArrow">
                        <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_rightArrow.png"></image>
                </view>
            </view>
  </view>
*/
.infoItem.radioBox .iTitle{
  width: auto;
}
.infoItem.radioBox .iTitle .radio{
  margin-right: 20rpx;
}
.infoItem.radioBox  .iContent{
    width: auto;
    justify-content: flex-end;
}
.infoItem.radioBox  .iContent .radio{
    margin-left: 20rpx;
    margin-right: 0;
}
.infoItem.radioBox  .iContent .downArrow{
    margin-top: 0;
}

/* 复选框 */
/* 代码示例：
   <view class="infoItem  entry  checkBox ">
            <view class="iTitle wp">
                <text class="star">*</text>
                <text>意向级别（多选）：</text>
            </view>
            <view class="iContent wp">
                <view class="checkitem dpflxr">
                    <view class="checkIcon actived"></view>
                    <text>A 户型</text>
                </view>
                <view class="checkitem dpflxr">
                    <view class="checkIcon actived"></view>
                    <text>B 户型</text>
                </view>
                <view class="checkitem dpflxr">
                    <view class="checkIcon"></view>
                    <text>C 户型</text>
                </view>
                <view class="checkitem dpflxr">
                    <view class="checkIcon"></view>
                    <text>D 户型</text>
                </view>
            </view>
        </view>
*/
.infoItem.checkBox{
  height: auto;
  width: 100%;
  border-bottom: 1rpx transparent solid;
}
.infoItem.checkBox .iTitle{
  line-height: 100rpx;
  border-bottom: 1rpx #eee solid;
  width: 100%;
  box-sizing: border-box;
  padding-left: 30rpx;
  padding-right: 30rpx;
}
.infoItem.checkBox .iContent{
  padding-top: 40rpx;
}
.infoItem.checkBox .iContent .checkitem{
  margin-bottom: 40rpx;
}
.infoItem .words{
  bottom: 20rpx;
  right: 30rpx;
  font-size: 24rpx;
  line-height: 24rpx;
}
.infoItem .total{
 color: #999;
}


/* 下拉客户列表样式 */
.customerList .customerItem{
  padding-top: 25rpx;
  padding-bottom: 40rpx;
  border-bottom:1rpx #eee solid ;
  justify-content: flex-start;
  align-items: flex-start;
}
.customerList .customerItem text{
  font-size: 24rpx;
  line-height: 24rpx;
  color: #999;
  margin-top: 20rpx;
  text-align: left;
  
}
.customerList .customerItem .nameBtn{
  width: 100%;
  justify-content: space-between;
}
.customerList .customerItem .name{
  font-size: 28rpx;
  line-height: 28rpx;
  color: #333;
  margin-top: 0;
}
.customerList .customerItem .btn{
  width: 72rpx;
  height: 36rpx;
  border-radius: 8rpx;
  border: 1rpx #356BF4 solid;
  color:#356BF4 ;
  font-size: 20rpx;
  line-height: 36rpx;
  text-align: center;
  margin-left: 10rpx;
}
.customerList .customerItem .tel{
  width: 100%;
  /* margin-top: 25rpx; */
  color: #333;
  justify-content: space-between;
}
.customerList .customerItem .tel text{
  margin-top: 25rpx;
  color: #333;
}
.customerList .customerItem .tel .consultant{
  color: #999;
}
.customerList .customerItem .lastDate{
  margin-top: 33rpx;
}
button{
  padding: 0rpx;
  margin: 0rpx;
  border-radius: 0rpx;
  font-weight: normal;
}
button:not([size='mini']) {
  width: auto;
  padding: 0rpx;
  margin: 0rpx;
  border-radius: 0rpx;
  font-weight: normal;
}
/* 按钮样式1 无外部容器 */
/* 代码示例：
  <navigator class="btn_box1">
        <text>提交</text>
    </navigator>
*/
button.btn_box1:not([size='mini']) {
  width: calc(100% - 60rpx);
  height: 80rpx;
  border-radius: 40rpx;
}

.btn_box1{
  width: calc(100% - 60rpx);
  height: 80rpx;
  position: fixed;
  left: 30rpx;
  bottom: 40rpx;
  z-index: 999;
  background-color: #F9600D;
  color: #fff;
  border-radius: 40rpx;
  text-align: center;
  font-size: 32rpx;
  line-height: 80rpx;
  box-shadow: 0px 8px 16px 0px #FFA26F;
}
/* 样式2：按钮在右侧，有背景色 */
/* 代码示例：
   <view class="btn_box2  dpflxr">
        <text>已选1人</text>
        <navigator class="btn" url="/pages/customer_list_assign/customer_list_assign">
            <text>分配</text>
        </navigator>
    </view>
*/
.btn_box2{ 
  width: 100%; 
  box-sizing: border-box;
  padding-left: 30rpx;
  height: 100rpx;
  position: fixed;
  left: 0rpx;
  bottom: 0rpx;
  z-index: 999;
  background-color: #fff;
  color: #333333;
  font-weight: bold;
  text-align: left;
  font-size: 28rpx;
  justify-content: space-between;
  border-top: 1rpx #eee solid;
}
.btn_box2 .amount{
  color: #FF1313;
}
.btn_box2 .btn{ 
  width: 240rpx;
  height: 100%;
  background-color: #F9600D;
  color: #fff;
  font-size: 32rpx;
  line-height: 100rpx;
  text-align: center;
  font-weight: normal;
} 

/* 样式3:底部全宽，有背景颜色，白字 */
/* 代码示例：
  <navigator class="btn_box3">
        <text>提交</text>
    </navigator>
*/
.btn_box3{ 
  width: 100%; 
  box-sizing: border-box;
  height: 100rpx;
  position: fixed;
  left: 0rpx;
  bottom: 0rpx;
  z-index: 999;
  background-color: #F9600D;
  color: #fff;
  text-align: center;
  font-size: 32rpx;
  line-height: 100rpx;
}
/* 样式4：两个按钮 */
/* 代码示例：
    <view class="btn_box4 dpflxr">
        <button class="btn">拒绝</button>
        <view class="btn right">同意</view>
    </view>
*/
.btn_box4 button:not([size='mini']) {
  width: calc((100% - 30rpx) / 2);
  color: #333;
  border-radius: 40rpx;
  height: 80rpx;
  padding: 0;
  line-height: 80rpx;
  text-align: center;
  background: #FAFAFA;
  box-shadow: 0px 8rpx 16rpx 0px #E5E5E5;
}

.btn_box4{
  width: calc(100% - 150rpx);
  height: 80rpx;
  position: fixed;
  left: 75rpx;
  bottom: 40rpx;
  z-index: 999;
  font-size: 32rpx;
  line-height: 80rpx;
}
.btn_box4 .btn{
  width: calc((100% - 30rpx) / 2);
  color: #333;
  border-radius: 40rpx;
  text-align: center;
  background: #FAFAFA;
  box-shadow: 0px 8rpx 16rpx 0px #E5E5E5;
}
.btn_box4 .btn.right{
  background-color: #F9600D;
  box-shadow: 0px 8rpx 16rpx 0px #FFA26F;
  margin-left: 30rpx;
  color: #fff;
}

/* 按钮样式1 无外部容器 */
/* 代码示例：
  <navigator class="btn_box5">
        <text>提交</text>
    </navigator>
*/
button.btn_box5:not([size='mini']) {
  width: calc(100% - 150rpx);
  height: 80rpx;
  border-radius: 40rpx;
}

.btn_box5{
  width: calc(100% - 150rpx);
  height: 80rpx;
  position: fixed;
  left: 75rpx;
  bottom: 40rpx;
  z-index: 999;
  background-color: #F9600D;
  color: #fff;
  border-radius: 40rpx;
  text-align: center;
  font-size: 32rpx;
  line-height: 80rpx;
  box-shadow: 0px 8px 16px 0px #FFA26F;
}

/* 轮播图设置 */
/*代码示例：  
   <view class="swiperContianor pos_rel">
        <swiper id="swiper" class="bgImg swiper pos_rel" bindchange="swiperChange" autoplay="true">
            <swiper-item id="p1">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/img_bg3.jpg" mode="aspectFill"></image>
            </swiper-item>
            <swiper-item id="p2">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/img_bg3.jpg" mode="aspectFill"></image>
            </swiper-item>
            <swiper-item id="p3">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/img_bg3.jpg" mode="aspectFill"></image>
            </swiper-item>

        </swiper>
        <view class="dots pos_abs dpflxr">
            <view class='dot {{swiperCurrent==0?"actived":""}}'></view>
            <view class='dot {{swiperCurrent==1?"actived":""}}'></view>
            <view class='dot {{swiperCurrent==2?"actived":""}}'></view>
        </view>
        <veiw class="pageNum pos_abs">{{swiperCurrent + 1}} / 3</veiw>
    </view>
    //swiperChange函数
     swiperChange:function(event){
        this.setData({
            swiperCurrent:event.detail.current,
        })
    },
*/
.swiperContianor {
  width: 100%;
  height: 340rpx;
  padding-top:30rpx;
  padding-bottom: 30rpx;
  box-sizing: border-box;
  background-color: #fff;
  border-radius: 0 0 30rpx 30rpx;
}
.swiperContianor .swiper {
  height: 100%;
}
.swiperContianor .swiper .swiperPage{
  height: 280rpx;
  border-radius: 20rpx;
  overflow: hidden;
}
.swiperContianor .dots {
  width: 86rpx;
  height: 12rpx;
  bottom: 50rpx;
  left: calc(50% - 43rpx);
  z-index: 2;
  justify-content: space-between;

}
.swiperContianor .dots .dot {
  width: 12rpx;
  height: 12rpx;
  background-color: #fff;
  border-radius: 6rpx;
  transition: all .6s;
}
.swiperContianor .dots .actived {
  width: 30rpx;
  background-color: #F9600D;
}
.swiperContianor .pageNum {
  width: 80rpx;
  height: 40rpx;
  background: rgba(0, 0, 0, 0.7);
  border-radius: 12rpx;
  font-size: 20rpx;
  text-align: center;
  color: #FFFFFF;
  line-height: 40rpx;
  bottom: 30rpx;
  left: calc(50% - 40rpx);
}


/* tab点击切换栏 样式1：文字颜色改变+加底部tabLine*/
/* 代码示例：
      <view class="tab_box">
        <!-- data-type ：1是全部 ，2是满减券, 3是抵扣券  -->
        <view class="title {{type == '1'? 'actived':''}} pos_rel" bindtap="optionTap" data-type="1">
            <text>全部</text>
            <view class="icon pos_abs">
              
            </view>
        </view>
        <view class="title {{type == '2'? 'actived':''}} pos_rel" bindtap="optionTap" data-type="2">
            <text>满减券</text>
            <view class="icon pos_abs">
               
            </view>
        </view>
        <view class="title {{type == '3'? 'actived':''}} pos_rel" bindtap="optionTap" data-type="3">
            <text>抵扣券</text>
            <view class="icon pos_abs">
               
            </view>
        </view>

        <view class="clear"></view>
    </view>



     // tab切换函数
     optionTap:function(event){
        const type = event.currentTarget.dataset.type;
        this.setData({
                type:type
                
        })
    },
*/
.tab_box {
  width: 100%;
  height: 100rpx;
  background-color: #fff;
  border-bottom: 1rpx #eee solid;
}
.tab_box .title {
  width:calc(100% / 3);
  font-size: 28rpx;
  line-height: 100rpx;
  color: #333;
  text-align: center;
  height: 100rpx;
}
.tab_box .icon {
  display: none;
  width: 40rpx;
  height: 6rpx;
  margin: 0 auto;
  margin-top: -6rpx;
  background: #F9600D;
  border-radius: 3rpx;
  bottom: 0;
  left: calc(50% - 20rpx);
}
.tab_box .title.actived {
  color: #F9600D;
  font-weight: bold;
}
.tab_box .title.actived .icon {
  display: block;
}
/* 样式2：背景颜色改变+外框线 */
/* 代码示例：
  <view class="cbTop">
        <view class="tab_box1 dpflxr w">
            <!-- data-type ：a是客户分配 ，b是客户分析-->
            <view class="title {{type == 'a'? 'actived':''}}" bindtap="optionTap" data-type="a">
                <text>客户分配</text>
            </view>
            <view class="title {{type == 'b'? 'actived':''}}" bindtap="optionTap" data-type="b">
                <text>客户分析</text>
            </view>
        </view>
*/
.tab_box1 {

  height: 60rpx;
  background-color: #fff;
  border-radius: 12rpx;
  border: 1rpx #356bf4 solid;
  overflow: hidden;
  border-left: none;
}
.tab_box1 .title {
  width:calc(100% / 3);
  font-size: 28rpx;
  line-height: 60rpx;
  color: #356bf4;
  text-align: center;
  box-sizing: border-box;
  border-left: 1rpx #356bf4 solid;
}
.tab_box1 .title.actived {
  background-color: #356bf4;
  color: #fff;
}
/* 样式3：文字颜色改变+外框线 */
.tab_box2 {
  width: 100%;
  height: 160rpx;
  background-color: #fff;
  border-bottom: 1rpx #eee solid;
  justify-content: space-evenly;

}
.tab_box2 .title {
  height: 100rpx;
  width:calc((100% - 150rpx)/ 4);
  float: left;
  font-size: 28rpx;
  line-height: 28rpx;
  color: #666;
  text-align: center;
  box-sizing: border-box;
  justify-content: center;
  border-radius: 12rpx;
}
.tab_box2 .title .amount{
  margin-top: 6rpx;
}
.tab_box2 .title.actived {
  color: #356BF4;
  border: 1rpx #356BF4 solid;
}
.tabOption{
  display: none;
}
.tabOption.actived{
  display: block;
}
.tabOptionF{
  display: none;
}
.tabOptionF.actived{
  display: -webkit-flex;
  display: flex;
}

/* 样式4：选项多，有滑块 */
/* 代码示例：
    <scroll-view class="tab_box4" scroll-x="true" enhanced="true" showScrollbar="false">
        <!-- data-type ：1是推荐 ，2是视频, 3是问答 ，4是达人 5是经验分享 6是装修误区-->
        <view class="title frist {{type == '1'? 'actived':''}}" bindtap="optionTap" data-type="1">
            <text>推荐</text>
            
            <view class="icon">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/tab_line.png"></image>
            </view>
        </view>
        <view class="title {{type == '2'? 'actived':''}}" bindtap="optionTap" data-type="2">
            <text>视频</text>
            <view class="icon">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/tab_line.png"></image>
            </view>
        </view>
        <view class="title {{type == '3'? 'actived':''}}" bindtap="optionTap" data-type="3">
            <text>问答</text>
            <view class="icon">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/tab_line.png"></image>
            </view>
        </view>
        <view class="title {{type == '4'? 'actived':''}}" bindtap="optionTap" data-type="4">
            <text>达人</text>
            <view class="icon">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/tab_line.png"></image>
            </view>
        </view>
        <view class="title {{type == '5'? 'actived':''}}" bindtap="optionTap" data-type="5">
            <text>经验分享</text>
            <view class="icon">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/tab_line.png"></image>
            </view>
        </view>
        <view class="title last {{type == '6'? 'actived':''}}" bindtap="optionTap" data-type="6">
            <text>装修误区</text>
            <view class="icon">
                <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/tab_line.png"></image>
            </view>
        </view>
        
    </scroll-view>
*/
.tab_box4 {
  width: 100%;
  display: block;
  height:100rpx;
  background-color: #f5f5f5;
  white-space: nowrap;
  overflow: visible;
  padding-top: 40rpx;
  box-sizing: border-box;
}
.tab_box4 .title {
  
 margin-right:60rpx;
  font-size: 28rpx;
  line-height: 28rpx;
  color: #333;
  text-align: center;
  display: inline-block;
  overflow: visible;
}
.tab_box4 .title.frist{
  margin-left: 30rpx;
}
.tab_box4 .title.last{
  margin-right: 30rpx;
}
.tab_box4 .title .icon {
  visibility: hidden;
  width: 40rpx;
  height: 6rpx;
  margin: 0 auto;
  margin-top: -6rpx;
  overflow: visible;
}
.tab_box4 .title.actived {
  color: #FE6903;
  font-weight: bold;
  transition: all 0.3s;
}
.tab_box4 .title.actived .icon {
  visibility: visible;
}

/* 搜索框 */
/* 代码示例：
  <view class="searchBox w dpflxr" >
        <view class="icon">
            <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_search.png"></image>
        </view>
        <input class="inputBox" type="text" placeholder="请输入客户姓名、手机号或置业顾问姓名"
            placeholder-style="font-size:24rpx; line-height:60rpx;color:#999;"></input>
    </view>
*/
.searchBox{
  height: 60rpx;
  margin-top: 20rpx;
  font-size: 24rpx;
  line-height: 24rpx;
  color: #999;
  justify-content: flex-start;
  background-color: #fff;
  border-radius: 30rpx;
}
.searchBox .icon{
  width: 28rpx;
  height: 28rpx;
  margin-right: 20rpx;
  margin-left: 20rpx;
}
.searchBox .inputBox{
  width: calc(100% - 88rpx);
  font-size: 24rpx;
  line-height: 24rpx;
  color: #333;
}
/* 样式2 */
/* 代码示例：
  <view class="searchBox2 w dpflxr" >
        <view class="icon">
            <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_search.png"></image>
        </view>
        <input class="inputBox" type="text" placeholder="请输入客户姓名、手机号或置业顾问姓名"
            placeholder-style="font-size:24rpx; line-height:60rpx;color:#999;"></input>
    </view>
*/
.searchBox2{
  height: 60rpx;
  font-size: 24rpx;
  line-height: 24rpx;
  color: #999;
  justify-content: flex-start;
  background-color: #f5f5f5;
  border-radius: 30rpx;
}
.searchBox2 .icon{
  width: 28rpx;
  height: 28rpx;
  margin-right: 20rpx;
  margin-left: 20rpx;
}
.searchBox2 .inputBox{
  width: calc(100% - 88rpx);
  font-size: 24rpx;
  line-height: 24rpx;
  color: #333;
}

/* 上传按钮 */
.uploadBtn{
  width: 122rpx;
  height: 122rpx;
  right: 29rpx;
  bottom: 45rpx;
  z-index: 999;
}


/* 弹出层背景 */
/* 代码示例：
    <!-- 弹出背景 -->
    <view class="commodity_screen" bindtap="hideModal" wx:if="{{showModalStatus}}"></view>
    <!-- 弹出框  -->
    <view animation="{{animationData}}" class="commodity_attr_box" wx:if="{{showModalStatus}}">
      <view class="close pos_abs" bindtap="hideModal">
            <image src="https://babybear-fx.oss-cn-shenzhen.aliyuncs.com/VIPxcx/%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9B%BE%E7%89%87/icon_close.png"></image>
        </view>
    </view>

  js代码：
  //点击显示底部弹出框函数
  click: function () {
    this.showModal();
  },
  //显示对话框函数
  showModal: function () {
    // 显示遮罩层
    var animation = wx.createAnimation({
      duration: 100,
      timingFunction: "easein",
      delay: 0
    })
    this.animation = animation
    animation.translateY(2000).step()
    this.setData({
      animationData: animation.export(),
      showModalStatus: true
    })
    setTimeout(function () {
      animation.translateY(0).step()
      this.setData({
        animationData: animation.export()
      })
    }.bind(this), 200)
  },
  //隐藏对话框函数
  hideModal: function () {
    // 隐藏遮罩层
    var animation = wx.createAnimation({
      duration: 200,
      timingFunction: "linear",
      delay: 0
    })
    this.animation = animation
    animation.translateY(300).step()
    this.setData({
      animationData: animation.export(),
    })
    setTimeout(function () {
      animation.translateY(0).step()
      this.setData({
        animationData: animation.export(),
        showModalStatus: false
      })
    }.bind(this), 200)
  },
*/
/* 弹出层背景  */
.shadowLayer {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: #000;
  opacity: 0.5;
  overflow: hidden;
  z-index: 997;
  color: #fff;
}
/* 弹出框 */
.popupWindow {
  width: 100%;
  overflow: hidden;
  position: fixed;
  bottom: 0;
  left:0;
  z-index: 998;
  background: #fff;
  border-radius: 20rpx 20rpx 0 0;
  box-sizing: border-box;
}
.popupWindow .close{
  width: 40rpx;
  height: 40rpx;
  border-radius: 20rpx;
  top: 30rpx;
  right: 30rpx;
  z-index: 999;
}
.popupWindow .btn_box1{
    width: calc(100% - 150rpx);
    height: 80rpx;
    position: static;
    margin-left: 75rpx;
    margin-top: 30rpx;
    border-radius: 40rpx;
    font-size: 28rpx;
    line-height: 80rpx;
    margin-bottom: 40rpx;
}



picker{
	z-index: 999;
}
.uni-picker-container{
	z-index: 999;
}
